<template>
	<view>
		<view class="noticeList">
			<view
				class="noticeList-content ff-border-radius-5 ff-padding-tblr ff-bg-fff ff-margin-top-10 ff-margin-bottom-10 ff-margin-left-10 ff-margin-right-10"
				v-for="(item, index) of noticeList" :key="index" @click="noticeDetailsClick(item.id)">
				<view class="ff-flex-between ff-margin-bottom-12">
					<view
						class="noticeList-content-title-left ff-color-333 ff-font-weight-600 ff-font-16 ff-ellipsis-1">
						{{ item.noticeName }}
					</view>
					<view class="noticeList-content-title-right ff-font-12">{{ item.created }}</view>
				</view>
				<view class="ff-ellipsis-1 ff-font-14 noticeList-content-tips">{{ item.noticeContent }}</view>
			</view>
			<u-divider v-if="noData" border-color="#909399" height="120" color="#909399"
				bg-color="#f5f5f5">没有更多了</u-divider>
		</view>
		<u-toast ref="uToast" />
		<f-loading ref="loading" />
	</view>
</template>

<script>
	export default {
		name: 'noticeList',
		data() {
			return {
				noticeList: [], // 公告列表
				current: 1,
				size: 10,
				noData: false // 没有更多数据了
			};
		},
		onLoad() {
			this.getNotice(); // 获取公告信息
		},
		// 上拉加载
		onReachBottom() {
			let that = this;
			that.current++;
			this.getNotice(this.current); // 获取的数据列表
		},
		// 下拉刷新
		async onPullDownRefresh() {
			let that = this;
			that.current = 1;
			await that.getNotice(that.current); // 获取的数据列表
			setTimeout(() => {
				that.$refs.uToast.show({
					title: '刷新成功',
					type: 'success'
				});
				uni.stopPullDownRefresh(); // 停止刷新
			}, 100);
		},
		methods: {
			// 获取公告信息
			getNotice() {
				this.$refs.loading.openLoading('加载中···'); // 打开loading动画
				let params = {
					current: this.current,
					size: this.size
				};
				this.$http
					.post({
						url: '/sys/notice/page',
						data: JSON.stringify(params)
					})
					.then(res => {
						// console.log('公告列表--------', res);
						if (res.code == 200) {
							const infoList = res.data.records;
							if (infoList.length == 0 && this.current == 1) {
								// console.log('首次加载没数据');
								this.noData = false;
								this.noticeList = [];
							} else if (infoList.length !== 0 && this.current == 1) {
								// console.log('首次加载有数据');
								this.noData = false;
								this.noticeList = infoList;
							} else if (infoList.length !== 0 && this.current > 1) {
								// console.log('上拉加载更多数据');
								this.noData = false;
								this.noticeList = this.noticeList.concat(infoList);
							} else if (infoList.length == 0 && this.current > 1) {
								// console.log('上拉加载没有更多数据了');
								this.noData = true;
							}
						} else {
							that.$refs.uToast.show({
								title: res.msg,
								type: 'error'
							});
						}
						this.$refs.loading.closeLoading(); // 打开loading动画
					});
			},
			// 点击公告进入公告详情页
			noticeDetailsClick(id) {
				this.$pageJump.navigateTo('/pages/common/notice/noticeListDetails?id=' + id);
			}
		}
	};
</script>

<style lang="scss" scoped>
	.noticeList {
		&-content {
			&-title-left {
				width: 376rpx;
			}

			&-title-right {
				color: #a8a7b5;
			}

			&-tips {
				color: #5c5f65;
			}
		}
	}
</style>